<template>
  <div style="background-color: #f2f2f2;height: 100%;">
    <div class="item info">
      <van-cell-group>
        <van-cell title="请假人" :value="info.name"/>
        <van-cell title="请假课程" :value="info.kcname"/>
        <van-cell title="请假时间" :value="info.time"/>
      </van-cell-group>
    </div>
    <div class="item des sae-textarea">
      <van-field type="textarea" rows="5" autosize v-model="info.reason" disabled>
        <div class="sae-label" slot="label">请假原因</div>
      </van-field>
    </div>
    <div class="btns">
      <van-button type="info" plain hairline @click="approve(2)" :disabled="disabled">不允许</van-button>
      <van-button type="info" @click="approve(1)" :disabled="disabled">允许</van-button>
    </div>
  </div>
</template>

<script>
import api from '@/api'
import {birthdayHandle} from '@/utils'
export default {
  name: 'leave-detail',
  data () {
    return {
      info: {
        name: '',
        kcname: '',
        time: '',
        reason: ''
      },
      disabled: true
    }
  },
  methods: {
    getInfo () {
      let params = {id: this.$route.params.id}
      api.teacherLeaveDetail({
        params,
        callback: res => {
          if (res.data.error_code === 0) {
            this.info = res.data.data
            this.info.time = birthdayHandle(new Date(Number(this.info.sktime) * 1000))
            this.disabled = this.info.status !== 3
          }
        }
      })
    },
    approve (status) {
      let params = {
        id: this.$route.params.id,
        status
      }
      api.teacherLeaveApprove({
        params,
        callback: res => {
          if (res.data.error_code === 0) {
            this.$router.go(-1)
          }
        }
      })
    }
  },
  created () {
    this.getInfo()
  }
}
</script>

<style scoped>
  .item.info{
    border-bottom: 10px solid #F2F2F2;
  }
</style>
